<template>
	<view>
		<view class="top flex-row-space-between">
			<view class="num">
				共：{{list.length}}个
			</view>
			<view @click="toUrl('storeAdd')" class="add">
				新增门店
			</view>
		</view>
		<view v-for="(item,index) in list" :key="index">
			<view v-if="index" class="line" style="margin: 0 32rpx;">

			</view>
			<view class="item ">
				<view class="flex-row-space-between">
					<!-- <image class="avatar" :src="item.avatar" mode=""></image> -->
					<view class="flex1">
						<view class="nickname">
							{{item.store_name}}
						</view>
						<view class="mobile">
							{{item.store_info}}
						</view>
					</view>
				</view>
				<view  class="flex-row-flex-end">
					<view @click="itemClick(item)" class="button flex-column-center" >
						员工列表
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapActions,
		mapState
	} from "vuex";
	import {
		storeList
	} from '@/api/index.js'
	export default {
		components: {},
		computed: {

		},
		data() {
			return {
				list: [],
				title: "",
				backgroundColor: 'ffffff00',
				list: [],
				data: {}

			}
		},
		computed: {
			...mapState([
				'baseColor'
			]),
		},
		onPageScroll(e) {
			if (e.scrollTop > 20) {
				this.backgroundColor = "#AED0FC"
			} else {
				this.backgroundColor = "#ffffff00"
			}
		},
		onShow() {
			this.loadData()
		},
		onLoad(e) {

		},
		//下拉刷新
		onPullDownRefresh() {


		},
		//加载更多
		onReachBottom() {

		},
		onPageScroll(e) {
			// if (e.scrollTop > 20) {
			// 	this.backgroundColor = "#FBF9FF"
			// } else {
			// 	this.backgroundColor = "#ffffff00"
			// }
		},
		methods: {
			itemClick(item){
				uni.setStorageSync('storeInfo', item)
				uni.navigateTo({
					url:'/pages/my/employeeManagement'
				})
			},
			loadData() {

				var data = {
					page: 1,
					page_size: 999
				}
				storeList(data).then(res => {
					this.list = res.data.data
				})
			},


		}
	}
</script>

<style lang="scss">
	page {
		background: #fff;
	}

	.top {
		padding: 0 32rpx;
		height: 92rpx;
		background-color: #F7F7FB;
	}

	.num {
		font-weight: 500;
		font-size: 28rpx;
		color: #666666;
	}

	.add {
		font-weight: 500;
		font-size: 28rpx;
		color: #157EFE;
	}

	.item {
		padding: 0 32rpx;
		margin: 20rpx 0;
		// height: 156rpx;
		background: #FFFFFF;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.avatar {
		margin-right: 20rpx;
		width: 96rpx;
		height: 96rpx;
		border-radius: 50%;
	}

	.nickname {
		font-weight: 500;
		font-size: 32rpx;
		color: #333333;
	}

	.mobile {
		margin-top: 4rpx;
		font-weight: 500;
		font-size: 28rpx;
		color: #666666;
	}

	.button {
		margin-top: 20rpx;
		margin-left: 20rpx;
		width: 240*0.6rpx;
		height: 80*0.6rpx;
		background: #157EFE;
		border-radius: 40rpx 40rpx 40rpx 40rpx;
		font-weight: 500;
		font-size: 24rpx;
		color: #FFFFFF;
	}
</style>